<template>
    <div>
        <!-- 面包屑 -->
        <elBread></elBread>
        <!-- 添加按钮 -->
        <el-button class="addBtn" type="primary" @click="addBtn">添加</el-button>
        <!-- 列表 -->
        <v-list @edit="edit"></v-list>
        <!-- 弹窗 -->
        <v-dialog :isShow="isShow" :isAdd='isAdd' @cancel="cancel" ref="dialogRef"></v-dialog>
    </div>
</template>
<script lang="ts" setup>
import { reactive, ref } from 'vue'
//引入列表组件和弹窗组件
import elBread from '@/components/el-bread.vue';
import vList from './list.vue'//列表
import vDialog from './dialog.vue'//弹窗
let isShow = ref(false)
let isAdd = ref(true)
//点击添加按钮
let addBtn = () => {
    isShow.value = true
    isAdd.value = true
}
//点击取消
let cancel = (e: any) => {
    isShow.value = e
    isAdd.value = true
}
//编辑
let dialogRef = ref()
let edit = (id: any) => {
    isShow.value = true
    isAdd.value = false
    dialogRef.value.lookup(id)
}



</script>
<style lang="less">
.addBtn {
    margin: 20px 0 10px ;
}
</style>